﻿<template>
  <baseConfigUI :config.sync="config" :events.sync="events">
    <el-row :gutter="20">
      <el-col :span="24">
        <el-form-item label = "占位内容">
            <el-input v-model = "config.other.placeholder"></el-input>
          </el-form-item>
      </el-col>
    </el-row>
    <el-row :gutter="20">
      <el-col :span="24">
        <el-form-item label = "日期格式">
          <el-select v-model="config.other.format" placeholder="请选择">
            <el-option
              v-for="item in formatOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row :gutter="20">
      <el-col :span="24">
        <el-form-item label = "多项设置">
          <el-checkbox v-model = "config.other.clearable">显示清除按钮</el-checkbox>
          <el-checkbox v-model = "config.other.isReadOnly">只读</el-checkbox>
        </el-form-item>
      </el-col>
    </el-row>
  </baseConfigUI>
</template>
<script>
import baseConfigUI from '../baseConfigUI.vue'
export default {
  components: {baseConfigUI},
  props: ['config', 'events'],
  data () {
    return {
      formatOptions: [{
        lable: 'yyyy-MM-dd',
        value: 'yyyy-MM-dd'
      }, {
        lable: 'yyyy/MM/dd',
        value: 'yyyy/MM/dd'
      }, {
        lable: 'yyyy年MM月dd日',
        value: 'yyyy年MM月dd日'
      }]
    }
  }
}
</script>
